<!Doctype html>
<html lang="zh-CN" xml:lang="zh-CN">
<head>
	<meta charset="utf-8"/>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1.0,minimum-scale=1.0, user-scalable=no, width=device-width">
    <title>media&blog - 登录</title>
    <meta name="keywords" content="微信,技术,兴趣,博客,社区,摄影,旅游,艺术,娱乐,综艺">
    <meta name="description" content="MB, 轻松分享你的兴趣. 便捷的文字、图片发布,扁平化的响应式设计,美观、大气,是您记录生活的最佳选择">
    <link href="/assets/css/bootstrap.css" rel="stylesheet" /> 
  	<link rel="stylesheet" media="screen" href="/assets/css/font-awesome.min.css" /> 

	<link rel="stylesheet" href="/assets/layui/css/layui.css" /> 
	<link rel="stylesheet" type="text/css" href="/assets/css/login.css">


	<script src="/assets/js/jquery.min.js"></script>
	<script src="/assets/jquery_validate/jquery.validate.min.js"></script>
	<script src="/assets/js/bootstrap.min.js"></script>
	<script src="/assets/layui/lay/dest/layui.all.js"></script> 
	
</head>

<body class="sign">
	<div class="login">
		<a href="/index">
			<img src="/assets/images/MB.png" height="72px" width="72px">
		</a>
		<h1>MB，Media and Blog，分享你的文章和视频。</h1>
		<hr>
		<form class="form-horizontal" id="login_form"  method="post" action="/login/doLogin?returnUrl=#(returnUrl)">
			<div style="margin-bottom: 25px" class="input-group">
                <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                <input id="username" type="text" class="form-control" name="userName" value="" placeholder="用户名/邮箱" required>
             </div>
			<div style="margin-bottom: 25px" class="input-group">
                <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
                <input id="password" type="password" class="form-control" name="password" placeholder="密码" minlength="4" maxlength="20" required>
            </div>
			<div class="checkbox">
	            <label>
	                <input type="checkbox" name="keepLogin" id="keepLogin" value='1' checked="checked"> 记住我？(勿在公用电脑上使用)
	            </label>
        	</div>
			<div style="margin-top: 15px;">
				<input type="submit" class="btn btn-success border" value="登录 Use it" style="pointer-events: auto;">

				<div class="forgot">
				    <a href="/reg">
				        注册
				    </a>
				    <a href="/login/forgetPassword">
				        忘记密码
				    </a>
				</div>
			</div>
		</form>
		<div class="with-line">使用第三方帐号登录</div>
		<div class="buttons">
	        <a href="/oauth/callback/call_weibo" title="微博帐号登录" rel="nofollow" class="weibo"></a>
	        <a href="/oauth/callback/call_qq" title="QQ帐号登录" rel="nofollow" class="qzone"></a>
	        <a href="/oauth/callback/call_douban" title="豆瓣帐号登录" rel="nofollow" class="douban"></a>
    	</div>
	</div>
	<p class="small">
		Copyright © MB <a href="/" target="_blank">
		</a>
	</p>
	<script type="text/javascript" src="/assets/jquery_form/jquery.form.min.js"></script>
	<script type="text/javascript" src="/assets/layer-v3.0.2/layer/layer.js"></script>

	<script type="text/javascript">
		$(document).ready(function() {
			$("#login_form").ajaxForm({
				dataType: "json"
				, beforeSubmit: function(formData, jqForm, options) {       
				    // 表单提交之前回调                                
					 // do nothing
				}
				, success: function(ret) {
					// 业务层验证成功
					console.log("ret:"+ret.isOK);
					if(ret.isOk) {
						location.href = ret.returnUrl;
						return ;
					}
					
					// 业务层验证失败
					if (ret.isFail) {
						layer.msg(ret.msg, {
									shift: 6
									, shade: 0.3
									, time: 2500
									, offset: "165px"
									, closeBtn: 1
									, shadeClose: true
								} , function() {
									//updateCaptcha();
								}
						);
						return ;
					}
				}
				, error: function(ret) { }              // ret.status != 200 时回调
				, complete: function(ret) { }       // 无论是 success 还是 error，最终都会被回调
			});
		});
	</script>
</body>
</html>